import { isHttps } from '@/utils/utils';
import { Image } from 'antd';

interface LicenseChangedViewProps {
  currentData: AbnormalOrderTableItem;
  currParkRecord: ParkingRecordParams;
  composeImageUrl: string;
}

const LicenseChangedView = (props: LicenseChangedViewProps) => {
  const { currentData, currParkRecord, composeImageUrl } = props;
  const lastImageUrl = currParkRecord?.lastPatrolInfo?.imageUrl || '';
  return (
    <>
      {currParkRecord && (
        <div style={{ textAlign: 'center', color: 'red', fontSize: 18 }}>
          <strong>
            {currParkRecord.spotId}泊位上一次巡检车牌为：
            {currParkRecord.lastPatrolInfo?.plateNumber || currParkRecord.plateNumber}
          </strong>
          <div
            style={{
              background: 'black',
              border: '1px solid #FFF',
              margin: '0 auto',
            }}
          >
            {lastImageUrl ? (
              <Image
                alt="巡检图片"
                style={{ maxHeight: 440 }}
                src={isHttps ? lastImageUrl : lastImageUrl.replace('http://', 'https://')}
              />
            ) : (
              '暂无图片'
            )}
          </div>
        </div>
      )}
      <div style={{ textAlign: 'center' }}>
        <img src="/arrow-down.png" style={{ width: 45, height: 45 }} />
      </div>
      {composeImageUrl && (
        <div style={{ textAlign: 'center', color: 'red', fontSize: 18 }}>
          <strong>
            {currentData.spotId}泊位本次巡检车牌为：{currentData.plateNumber}
          </strong>
          <div
            style={{
              background: 'black',
              border: '1px solid #FFF',
              margin: '0 auto',
            }}
          >
            <Image
              alt="巡检图片"
              style={{ maxHeight: 440 }}
              src={isHttps ? composeImageUrl : composeImageUrl.replace('http://', 'https://')}
            />
          </div>
        </div>
      )}
    </>
  );
};

export default LicenseChangedView;
